import { request } from "../../request/request.js";
import { showToast } from "../../utils/asyncWx.js";
/*
  1 发送请求获取数据
  2 保存数据
  3 点击轮播图 预览
   1 给轮播图绑定点击事件
   2 调用小程序的api previewImage
  4 点击 加入购物车
    1 先绑定点击事件
    2 获取缓存中的购物车数据 数组格式
    3 先判断 当前的商品是否已经存在于购物车
    4 已经存在 修改商品数据 执行购物车数量++ 重新吧购物车数组 填充回缓存中
    5 不存在于购物车的数组中 直接个购物车数组添加一个新的元素 新元素 带上 购买数量属性 num
      创新吧购物车数组 填充回缓存中
    6 弹出提示
  5 商品收藏
   1 页面onShow的时候，加载缓存中的商品收藏数据
   2 判断当前商品是不是被收藏
    1 是 改变页面的图标
    2 不是。。。
  3 点击商品收藏按钮
   1 判断该商品是否存在于缓存数组中
   2 已经存在 把该商品删除
   3 没有存在 把商品添加到收藏数组中 存入到缓存中即可
*/
// pages/goods_detail/goods_detail.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 商品详细信息
    goodsObj: {},
    isCollect: false
  },
  GoodsInfo: {},
  /**
   * 生命周期函数--监听页面加载
   */
  onShow: function () {
    const pages = getCurrentPages();
    const curPages = pages[pages.length - 1];
    const { options } = curPages;
    // 获取用户点击商品的id，url传递
    const { goods_id } = options;
    // 获取商品详细信息
    this.getGoods_detail(goods_id);

  },
  // 获取商品详细信息
  async getGoods_detail(goods_id) {
    // 1 发送数据请求，异步
    const res = await request({ url: "/goods/detail", data: { goods_id } });
    // 2 保存商品详细信息
    const goodsObj = res.data.message;
    // 3 将商品信息保存，预备后续的使用
    this.GoodsInfo = res.data.message
    // 4 优化数据，并将数据保存到页面中
    const pics = goodsObj.pics.map(v => ({ pics_id: v.pics_id, pics_mid: v.pics_mid }));

    // 1 获取缓存中的商品数组
    let collect = wx.getStorageSync("collect")||[];
    // 2 判断商品数组中是否存在商品详情页面的商品
    let isCollect = collect.some(v => v.goods_id === this.GoodsInfo.goods_id);
    //保存数据
    this.setData({
      goodsObj: {
        goods_name: goodsObj.goods_name,
        goods_price: goodsObj.goods_price,
        goods_introduce: goodsObj.goods_introduce,
        goods_name: goodsObj.goods_name,
        pics,
      },
      isCollect
    })
  },
  // 点击 轮播图 预览
  handlePreviewImage(e) {
    const urls = this.data.goodsObj.pics.map(v => v.pics_mid);
    const current = e.currentTarget.dataset.url;
    console.log(e)
    wx.previewImage({
      current, // 当前显示图片的http链接
      urls // 需要预览的图片http链接列表
    })
  },
  //点击 加入购物车 
  handleCartAdd() {
    // 1 获取缓存中的购物车 数组
    let cart = wx.getStorageSync("cart") || [];
    // 2 判断商品对象是否存在于购物车数组中
    let index = cart.findIndex(v => v.goods_id === this.GoodsInfo.goods_id);
    if (index === -1) {
      //3 不存在 第一次添加
      this.GoodsInfo.num = 1;
      // 当前是否在购物车中选中
      this.GoodsInfo.checked = true;
      cart.push(this.GoodsInfo);
    } else {
      //4 已经存在购物车数据 执行 num++
      cart[index].num++;
    }
    // 5 把购物车创新添加回缓存中
    wx.setStorageSync("cart", cart);
    wx.showToast({
      title: '添加成功',
      icon: 'success',
      mask: true,
    });
  },
  //点击收藏按钮
  handleCollect() {
    // 1 获取缓存中的收藏数组，和页面中的收藏状态
    const collect = wx.getStorageSync("collect")||[];
    let isCollect = this.data.isCollect;
    // 2 判断商品是否存在收藏数组中, 之前已经获取到了收藏数组
    if (isCollect) {
      //如果存在，侧删除收藏数数组中的商品信息
      const index = collect.findIndex(v => (v.goods_id === this.GoodsInfo.goods_id));
      collect.splice(index, 1);
      showToast({title:"取消收藏", icon:"success"});
    } else {
      //否则，将商品添加到收藏数组中
      collect.push(this.GoodsInfo);
      showToast({title:"收藏成功", icon:"success"});
    }
    // 3 对当前商品的收藏状态取反
    isCollect = !isCollect;
    this.setData({
      isCollect
    })
    // 4 将收藏数组保存到缓存中
    wx.setStorageSync("collect", collect);
  }
})
